<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <title>定制海报</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/Afterposter.css">
</head>

<body>
    <div id="posterBox">
        <div id="lunbo">
            <!-- 当轮播图只有一张的时候才可以拖拽图片，多张时拖拽会是轮播效果 -->
            <div class="picBox" num="1" id="curPost">
                <img src="images/logo.png" alt="logo" class="posterLogo">
                <img src="images/backimg3.png" class="botPic">
                <img src="images/posterimg.jpg" class="backImg" alt="">
            </div>
            <!-- <div class="picBox" num="2">
                <img src="./images/backImg2.png">
                <img src="./images/posterimg.jpg" class="backImg" alt="">
            </div> -->
            <!-- <div class="picBox" num="3">
                <img src="./images/backImg2.png">
                <img src="./images/posterimg.jpg" class="backImg" alt="">
            </div>
            <div class="picBox" num="4">
                <img src="./images/backImg2.png">
                <img src="./images/posterimg.jpg" class="backImg" alt="">
            </div> -->
            <!-- 生成的分享图片放在这里 -->
           <!-- <img src="images/backimg3.png" id="sharePicBox"> -->
        </div>
    </div>
    <div id="recommend">
        <!-- 推荐语-->
        <div id="recomTitle">
            <span>推荐语</span>
            <em id="creRadio" class="trueStyle" isChecked="1"></em>
        </div>
        <p id="recomText">在家就能上科学课做实验，孩子喜欢，连大人都觉得很有意思，锻炼了动手能力，学到很多科学知识，陪孩子一起晚也挺有趣的。推荐大家也试试看呀～</p>
    </div>
    <div id="getPosterImg">定制宝贝专属海报</div>
    <div id="share">
        <div>
            <img src="./images/weixin.png" alt="">
            <p>微信好友</p>
        </div>
        <div>
            <img src="./images/pengyouquan.png" alt="">
            <p>朋友圈</p>
        </div>
    </div>
    <div id="customMadeBtns">
        <div class="flexBoxRow">
            <div id="uploadImg">上传照片<input type="file" id="uploadFile" accept="image/png,image/jpg"></div>
            <div id="createPoster">生成并分享海报</div>
        </div>
    </div>
    <!-- 遮罩层 -->
    <div id="shadeCeng">
        <div class="flexBoxCol">
            <div id="border"></div>
            <img src="./images/tipBook.png" id="tipText" alt="tipBook">
            <div id="iKnowBtn">我知道了</div>
            <label id="mineRadioLabel">
                <div id="mineRadio" isChecked="0"></div>不再显示
            </label>
        </div>
    </div>
    <script src="./js/canvas2Image.js"></script>
    <script src="./js/html2canvas.js"></script>
    <script src="./js/jq.min.js"></script>
    <script src="./js/aliyun/es6-promise.min.js"></script>
    <script src="./js/aliyun/aliyun-oss-sdk-5.3.1.min.js"></script>
    <script src="./js/aliyun/aliyun-upload-sdk-1.5.0.min.js"></script>
    <script src="./js/Afterposter.js"></script>
</body>

</html>